<template>
	<view class="contain">
		<view class="headName flex justify-between items-center">
			<view class="w-2/3 text-xl text-white">**宏的钱包</view>
			<view class="w-2/4 relative left-4">
				<text class="mr-1 text-sm tbg">已实名</text>
				<text class="text-sm tbg">安全保障中</text>
			</view>
		</view>
		<view class="rounded-md p-3 detail">
			<view class="text-gray-500">总资产(元)</view>
			<view class="flex justify-between items-center price">
				<view class="text-4xl" style="font-weight:600;">{{totalPrice}}</view>
				<view><u-icon name="arrow-right" color="#999" size="18"></u-icon></view>
			</view>
			<u-gap height="1" bgColor="#f3f3f3" marginTop="15" marginBottom="15"></u-gap>
			<view class="datas">
				<u-row customStyle="margin-top: 10px; margin-bottom: 10px">
					<u-col span="3" justify="start" align="left" textAlign="left">
						<view class="fontname">金币</view>
						<view class="fontnum">0</view>
					</u-col>
					<u-col span="3" justify="start" align="left" textAlign="left">
						<view class="fontname">DOU+币</view>
						<view class="fontnum">0</view>
					</u-col>
					<u-col span="3" justify="start" align="left" textAlign="left">
						<view class="fontname">卡券</view>
						<view class="fontnum">2</view>
					</u-col>
					<u-col span="3" justify="start" align="left" textAlign="left">
						<view class="fontname">银行卡</view>
						<view class="fontnum">1</view>
					</u-col>
				</u-row>
			</view>
		</view>
		<!-- 金融服务 -->
		<view class="rounded-md p-3 detail">
				<view class="text-gray-500">金融服务</view>
				<view class="icons">
					<u-row customStyle="margin-top: 10px; margin-bottom: 10px">
						<u-col span="2" justify="center" align="center" textAlign="center">
							<view><image class="icon" src="../../static/icons/qb.png"></image></view>
							<view class="ifontnum">放心借</view>
						</u-col>
						<u-col span="2" justify="center" align="center" textAlign="center">
							<view><image class="icon" src="../../static/icons/qb.png"></image></view>
							<view class="ifontnum">抖音月付</view>
						</u-col>
						<u-col span="2" justify="center" align="center" textAlign="center">
							<view><image class="icon" src="../../static/icons/qb.png"></image></view>
							<view class="ifontnum">钱包支付</view>
						</u-col>
						<u-col span="2" justify="center" align="center" textAlign="center">
							<view><image class="icon" src="../../static/icons/qb.png"></image></view>
							<view class="ifontnum">信用卡</view>
						</u-col>
						<u-col span="2" justify="center" align="center" textAlign="center">
							<view><image class="icon" src="../../static/icons/qb.png"></image></view>
							<view class="ifontnum">信用卡</view>
						</u-col>
						<u-col span="2" justify="center" align="center" textAlign="center">
							<view><image class="icon" src="../../static/icons/qb.png"></image></view>
							<view class="ifontnum">信用卡</view>
						</u-col>
					</u-row>
				</view>
		</view>
		<!-- 平台服务 -->
		<view class="rounded-md p-3 detail">
				<view class="text-gray-500">平台服务</view>
				<view class="icons">
					<u-row customStyle="margin-top: 10px; margin-bottom: 10px">
						<u-col span="2" justify="center" align="center" textAlign="center">
							<view><image class="icon" src="../../static/icons/sell.png"></image></view>
							<view class="ifontnum">商城</view>
						</u-col>
						<u-col span="2" justify="center" align="center" textAlign="center">
							<view><image class="icon" src="../../static/icons/sell.png"></image></view>
							<view class="ifontnum">会员</view>
						</u-col>
						<u-col span="2" justify="center" align="center" textAlign="center">
							<view><image class="icon" src="../../static/icons/sell.png"></image></view>
							<view class="ifontnum">放心购</view>
						</u-col>
						<u-col span="2" justify="center" align="center" textAlign="center">
							<view><image class="icon" src="../../static/icons/sell.png"></image></view>
							<view class="ifontnum">粉丝团</view>
						</u-col>
						<u-col span="2" justify="center" align="center" textAlign="center">
							<view><image class="icon" src="../../static/icons/sell.png"></image></view>
							<view class="ifontnum">手机充值</view>
						</u-col>
						<u-col span="2" justify="center" align="center" textAlign="center">
							<view><image class="icon" src="../../static/icons/sell.png"></image></view>
							<view class="ifontnum">车主</view>
						</u-col>
					</u-row>
				</view>
		</view>
	</view> <!-- contain End -->
</template>

<script setup lang='ts'>
	import { ref,reactive } from 'vue'
	const totalPrice=ref("100.00");
</script>

<style>
	page{
		background:linear-gradient(to bottom, #9AAFF2, white);
	}
</style>
<style lang='scss' scoped>
	@import "shop_moneybag.scss";
</style>